@import "./reset.less";

@primaryColor: #672683;

:root {
   /* 辅助颜色  主要是用于点缀的，这个不建议使用跟背景色相近的颜色*/
   --primaryColor: @primaryColor;
   --primaryColor10: tint(@primaryColor, 90);
   --primaryColor20: tint(@primaryColor, 80);
   --primaryColor50: tint(@primaryColor, 50);

   --el-color-primary: @primaryColor !important;
   --el-color-primary-light-1: tint(@primaryColor, 10) !important;
   --el-color-primary-light-2: tint(@primaryColor, 20) !important;
   --el-color-primary-light-3: tint(@primaryColor, 30) !important;
   --el-color-primary-light-4: tint(@primaryColor, 40) !important;
   --el-color-primary-light-5: tint(@primaryColor, 50) !important;
   --el-color-primary-light-6: tint(@primaryColor, 60) !important;
   --el-color-primary-light-7: tint(@primaryColor, 70) !important;
   --el-color-primary-light-8: tint(@primaryColor, 80) !important;
   --el-color-primary-light-9: tint(@primaryColor, 90) !important;
   --el-color-primary-dark-2: shade(@primaryColor, 10) !important;


   --app-border-radius: 5px;
   // 全局层高设计
   // 1-5 是使用可以自定义的
   //6-9 表示为系统内置
   //弹框
   --zindexModalView: 8;
}


//滚动条
div {
   &::-webkit-scrollbar {
      width: 8px;
      height: 12px;
      background: white;
   }

   &::-webkit-scrollbar-corner,
   /* 滚动条角落 */
   &::-webkit-scrollbar-thumb,
   &::-webkit-scrollbar-track {
      border-radius: 4px;
   }

   &::-webkit-scrollbar-corner,
   &::-webkit-scrollbar-track {
      /* 滚动条轨道 */
      background-color: rgba(180, 160, 120, 0.1);
      box-shadow: inset 0 0 1px rgba(180, 160, 120, 0.5);
   }

   &::-webkit-scrollbar-thumb {
      /* 滚动条手柄 */
      background-color: rgba(0, 0, 0, 0.1);

      &:hover {
         background-color: var(--primaryColor50);
      }
   }
}

.fr {
   float: right;
}

.fl {
   float: left;
}

.tc {
   text-align: center;
}


// 框架矫正
.el-link {
   text-decoration: none !important;
}

.el-button {
   &:focus {
      outline: 3px solid var(--el-color-primary-light-7) !important;
   }
}

.el-message-box__btns {
   justify-content: flex-start !important;
   direction: rtl;
   button{
      margin-left: 10px;
   }
}